<template>
    <div>
        <van-nav-bar title="注册" left-text="返回首页" left-arrow @click-left="onClickLeft" />
    </div>
    <div>
        <van-form @submit="onSubmit">
            <van-cell-group inset>
                <van-field v-model="userInfo.userName" name="userName" label="用户名" placeholder="请输入手机号"
                    :rules="[{ required: true, message: '请填写用户名' }]" />
                <van-field v-model="userInfo.phone" name="phone" label="手机号" placeholder="请输入手机号"
                    :rules="[{ required: true, message: '请填写手机号' }]" />
                <van-field v-model="userInfo.password" type="password" name="password" label="密码" placeholder="请输入密码"
                    :rules="[{ required: true, message: '请填写密码' }]" />
                <van-field v-model="userInfo.email" name="email" label="邮箱" placeholder="请输入邮箱"
                    :rules="[{ required: true, message: '请填写邮箱' }]" />
                <van-field v-model="userInfo.invitedCode" name="invitedCode" label="邀请注册码" placeholder="请输入邀请注册码" />
            </van-cell-group>
            <div style="margin: 16px;">
                <van-button round block type="primary" native-type="submit">
                    注册
                </van-button>
            </div>
        </van-form>
    </div>
    <div style="text-align: center;">
        <van-icon name="wechat" color="green" size="30px" @click="wechat()" />
        <van-icon name="alipay" color="RGB(0, 128, 255)" size="30px" @click="alipay()" />
    </div>
</template>
<script setup>
import router from '@/router';
import { ref } from 'vue';
import { Registry } from '@/api/user.js'

const onClickLeft = () => {
    router.push('/')
};
const userInfo = ref({
    userName: '',
    phone:'',
    password: '',
    invitedCode: '',
    email: ''
}

);

const onSubmit = (values) => {
    const registryM = { ...values }; // 添加其他参数 
    Registry(registryM)
        .then(res => {
            if (res.data.code === 200000) {
                router.push("/user/login");
            } else {
                //错误提示框
            }
        })
};

function wechat() {
    console.info('wechat login')
}
function alipay() {
    console.info('alipay login')
}
</script>